<template>
    <div>

        <el-dialog  :visible.sync="dialogTableVisible" title="客户详细信息">
            <el-form :model="ticketValid"  ref="refundForm" label-width="100px" style="width: 500px; margin-left: 180px" size="small "
            >
                <el-form-item label="客户账号：" prop="cusAccount" style="">
                    <el-input v-model="ticketValid.cusAccount" :disabled="true" />
                </el-form-item>
                <el-form-item label="密   码：" prop="cusPwd">
                    <el-input v-model="ticketValid.cusPwd" :disabled="true"  />
                </el-form-item>
                <el-form-item label="姓   名：" prop="cusName">
                    <el-input v-model="ticketValid.cusName" :disabled="true" />
                </el-form-item>
                <el-form-item label="身份证号：" prop="cusId">
                    <el-input v-model="ticketValid.cusId" :disabled="true"/>
                </el-form-item>
                <el-form-item label="电话号码：" prop="cusTelNumber">
                    <el-input v-model="ticketValid.cusTelNumber" :disabled="true"/>
                </el-form-item>
                <el-form-item label="年   龄：" prop="cusAge">
                    <el-input v-model="ticketValid.cusAge"  :disabled="true"/>
                </el-form-item>
                <el-form-item label="性   别：" prop="cusSex">
                    <el-input  v-model="ticketValid.cusSex" :disabled="true"></el-input>
                </el-form-item>
                <el-form-item label="邮   箱：" prop="cusEmail">
                    <el-input v-model="ticketValid.cusEmail" :disabled="true"/>
                </el-form-item>
                <el-form-item label="种   类：" prop="cusType">
                    <el-input v-model="ticketValid.cusType"  :disabled="true"/>
                </el-form-item>
                <el-form-item label="积   分：" prop="cusIntegral">
                    <el-input v-model="ticketValid.cusIntegral" :disabled="true"/>
                </el-form-item>
                <el-form-item label="注册时间：" prop="cusTime">
                    <el-input v-model="ticketValid.cusTime" :disabled="true"/>
                </el-form-item>
                <el-form-item>
                    <el-button @click="editDialogVisible=false">确定</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>



        <el-dialog :visible.sync="dialogTableVisible2" title="订单详细信息">
            <el-form   :model="ticketValid"  ref="refundForm" label-width="100px" style="width: 500px; margin-left: 180px" size="small "
            >
                <el-form-item label="订单编号：" prop="cusAccount" >
                    <el-input v-model="ticketValid.cusAccount" :disabled="true" />
                </el-form-item>
                <el-form-item label="机票编号：" prop="booNo">
                    <el-input v-model="ticketValid.booNo" :disabled="true" />
                </el-form-item>
                <el-form-item label="账   号：" prop="booOrderNum">
                    <el-input v-model="ticketValid.booOrderNum" :disabled="true" />
                </el-form-item>
                <el-form-item label="姓   名：" prop="cusName">
                    <el-input v-model="ticketValid.cusName" :disabled="true"/>
                </el-form-item>
                <el-form-item label="身份证号：" prop="cusId">
                    <el-input v-model="ticketValid.cusId" :disabled="true"/>
                </el-form-item>
                <el-form-item label="电话号码：" prop="cusTelNumber">
                    <el-input v-model="ticketValid.cusTelNumber"  :disabled="true"/>
                </el-form-item>
                <el-form-item label="预定时间：" prop="booTime">
                    <el-input v-model="ticketValid.booTime" :disabled="true"/>
                </el-form-item>
                <el-form-item label="预定状态：" prop="flag">
                    <el-input v-model="ticketValid.flag" :disabled="true"/>
                </el-form-item>
                <el-form-item>
                    <el-button @click="editDialogVisible2=false">确定</el-button>
                </el-form-item>

            </el-form>
        </el-dialog>

        <el-breadcrumb separator-class="el-icon-arrow-right"
                       style="background-color:white;padding: 8px;margin-bottom: 20px">
            <el-breadcrumb-item>首页</el-breadcrumb-item>
            <el-breadcrumb-item>航空机票管理</el-breadcrumb-item>
            <el-breadcrumb-item>订票管理</el-breadcrumb-item>
        </el-breadcrumb>
        <el-table :data="bookInformationList" width="100%">
            <el-table-column prop="cusAccount" label="客户编号">
                <template slot-scope="scope">
                    <el-button type="text" @click="khNum(scope.$index,scope.row)">{{scope.row.cusAccount}}</el-button>
                </template>
            </el-table-column>
            <el-table-column prop="booOrderNum" label="订单号">
                <template slot-scope="scope">
                    <el-button type="text" @click="ddNum(scope.$index,scope.row)">{{scope.row.booOrderNum}}</el-button>
                </template>
            </el-table-column>
            <el-table-column prop="booNo" label="航班号"></el-table-column>
            <el-table-column prop="booTime" label="预定时间"></el-table-column>
            <el-table-column prop="booBTime" label="起飞时间"></el-table-column>
            <el-table-column label="操作">
                <template slot-scope="scope">
                    <el-button size="mini" @click="chargeFlag(scope.$index,scope.row)">通过</el-button>
                </template>
            </el-table-column>

        </el-table>
        <el-pagination
                style="margin-top: 10px"
                background
                layout="prev, pager, next"
                :current-page.sync="pageInfo.pageNum"
                :page-count="pageInfo.pages"
                :page-size="pageInfo.pageSize"
                :total="pageInfo.total"
                @current-change="this.findList"
        >
        </el-pagination>
    </div>
</template>

<script>
    export default {
        name: "CheckTicket",
        created() {
            this.findList();
        },
        methods:{
            khNum(index, row) {
                //弹出一个可以修改输入用户信息的表单窗口
                this.vaAccout=row.cusAccount;
                this.dialogTableVisible = true;
                let clone = _.clone(row);
                this.ticketValid = clone;
            },
            ddNum(index, row) {
                //弹出一个可以修改输入用户信息的表单窗口
                this.vaAccout=row.cusAccount;
                this.dialogTableVisible2 = true;
                let clone = _.clone(row);
                this.ticketValid = clone;
            },
            chargeFlag(index, row) {
                this.$confirm('此操作将通过审核, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {

                    axios.delete('/bookInformation/charge/' + row.id).then(resp => {
                        if (resp.data === 'success') {
                            this.$message({
                                type: 'success',
                                message: '审核通过!'
                            })
                        }
                        //重新获取表格数据
                        this.findList();
                    })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '审核已取消！'
                    });
                });

            },
            findList() {
                axios.post("/bookInformation/pageTicketValid/", {
                    pageNum: this.pageInfo.pageNum,
                    pageSize: this.pageInfo.pageSize,
                    condition: {}
                }).then(resp => {
                    //console.log(resp.data);
                    this.pageInfo.pageSize = resp.data.pageSize;
                    this.pageInfo.pageNum = resp.data.pageNum;
                    this.pageInfo.total = resp.data.total;
                    this.pageInfo.pages = resp.data.pages;
                    //将数据赋值给bookInformationList表格数据
                    this.bookInformationList = resp.data.list;
                })
            },
        },
        data(){
            return {
                //pageInfo对象实际是从后台查询得到的，代表了分页必要的信息
                pageInfo: {
                    pageNum: 1, /*当前是那一页*/
                    pageSize: 5, /*每页展示多少条*/
                    pages: 10, /*总共有多少页*/
                    total: 100 /*总共有多少条数据*/
                },
                vaAccout:"",
                bookInformationList:[],
                ticketValid:{},
                customerInf:[],
                orderInf:[],
                dialogTableVisible:false,
                dialogTableVisible2:false

            }
        }


    }
</script>

<style scoped>

</style>
